Planning Your Screens

Before building CygNet Studio screens, create a set of guidelines to ensure that screens in your system behave in a consistent fashion and are intuitive due to a consistent look and feel. In these guidelines, include items for TheFrame/TheView, colors, fonts, images, navigation methods, object naming conventions, file storage and file naming, etc.

TheView Sizing and Placement

Most CygNet Studio/CygNet Vision users in your company likely will not have the same monitor size or monitor type. Keep this in mind when designing your screen. Items to consider include:

• Size of TheView — What will be the default size of TheView when it is opened? Will it have a maximum or minimum height and width? Will it have minimize and maximize buttons? Will it be full screen?
• Workspace Arrangement — If multiple screens are included in a workspace, what will be their default positions on the screen?
• Resizing — Are you going to allow users to resize TheView? If not, then TheView must be sized to accommodate the lowest common denominator screen size. If so, how will the individual objects resize? Will they shift, resize proportionally, or remain static? Will scroll bars be included? At what height and width will scroll bars appear? Will the height and width have a fixed ratio? Will font sizes remain static or resize?

Colors

Due to the variety of graphics cards, custom colors may not appear the same on different monitors. Stick with a standard palette for best results.

Apply consistent use of color from screen to screen as a best practice. This includes colors that represent data, alarms, foreground, and background colors.

Fonts

Another important item to consider is the font. As with colors, it is best to use a standard font. If you use custom fonts and your Studio users don’t have the font on their computers, the substituted font may not show as intended.

Applied consistent use of fonts from screen to screen as a best practice. This includes font face, font size, font style, and font color.

Images

CygNet Studio allows the use of both pixel-based (bitmap) and line-based (vector) images. Both types of images can resize with TheView; however, bitmap images will lose resolution when resized.

Navigation

Keep navigation elements provided on TheView consistent from screen to screen.